import echarts, { EChartOption } from "echarts";

export function option(data: { _id: string, number: number }[]): EChartOption {
    let xAxisdata: string[] = data.map((item) => item._id)
    let supcount: number[] = data.map((item) => item.number)
    // let discount: number[] = data.map((item) => item.discount)
    return {
        title: {
            text: '一周用户下载统计表',
            textStyle: {
                color: '#fff',
                align: 'center',
            },
            left: 'center',
        },
        // legend: {
        //     left: 'center',
        //     top: '0%',
        //     textStyle: {
        //         color: '#90979c',
        //     },
        //     data: ['应用分发', '超级签']
        // },
        tooltip: {
            trigger: 'axis',
            axisPointer: {
                lineStyle: {
                    color: {
                        type: 'linear',
                        x: 0,
                        y: 0,
                        x2: 0,
                        y2: 1,
                        colorStops: [{
                            offset: 0,
                            color: 'rgba(0, 255, 233,0)'
                        }, {
                            offset: 0.5,
                            color: 'rgba(255, 255, 255,1)',
                        }, {
                            offset: 1,
                            color: 'rgba(0, 255, 233,0)'
                        }],
                        global: false
                    }
                },
            },
        },
        grid: {
            top: '15%',
            left: '5%',
            right: '5%',
            bottom: '15%',
        },
        xAxis: [{
            type: 'category',
            axisLine: {
                show: true
            },
            splitArea: {
                // show: true,
                color: '#f00',
                lineStyle: {
                    color: '#f00'
                },
            },
            axisLabel: {
                color: '#fff'
            },
            splitLine: {
                show: false
            },
            boundaryGap: false,
            data: xAxisdata,

        }],

        yAxis: [{
            type: 'value',
            min: 0,
            splitNumber: 4,
            splitLine: {
                show: true,
                lineStyle: {
                    color: 'rgba(255,255,255,0.1)'
                }
            },
            axisLine: {
                show: false,
            },
            axisLabel: {
                show: false,
                margin: 20,
                textStyle: {
                    color: '#d1e6eb',
                },
            },
            axisTick: {
                show: false,
            },
        }],
        series: [
            {
                name: '7日下载统计',
                type: 'line',
                showAllSymbol: true,
                symbol: 'circle',
                symbolSize: 5,
                lineStyle: {
                    normal: {
                        color: "#00ca95",
                        shadowColor: 'rgba(0, 0, 0, .3)',
                        shadowBlur: 0,
                        shadowOffsetY: 5,
                        shadowOffsetX: 5,
                    },
                },
                label: {
                    show: true,
                    position: 'top',
                    textStyle: {
                        color: '#00ca95',
                    }
                },

                itemStyle: {
                    color: "#00ca95",
                    borderColor: "#fff",
                    borderWidth: 3,
                    shadowColor: 'rgba(0, 0, 0, .3)',
                    shadowBlur: 0,
                    shadowOffsetY: 2,
                    shadowOffsetX: 2,
                },
                tooltip: {
                    show: false
                },
                areaStyle: {
                    normal: {
                        color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
                            offset: 0,
                            color: 'rgba(0,202,149,0.3)'
                        },
                        {
                            offset: 1,
                            color: 'rgba(0,202,149,0)'
                        }
                        ], false),
                        shadowColor: 'rgba(0,202,149, 0.9)',
                        shadowBlur: 20
                    }
                },
                data: supcount,
            },
            // {
            //     name: '超级签',
            //     type: 'line',
            //     showAllSymbol: true,
            //     symbol: 'circle',
            //     symbolSize: 5,
            //     lineStyle: {
            //         normal: {
            //             color: "#6c50f3",
            //             shadowColor: 'rgba(0, 0, 0, .3)',
            //             shadowBlur: 0,
            //             shadowOffsetY: 5,
            //             shadowOffsetX: 5,
            //         },
            //     },
            //     label: {
            //         show: true,
            //         position: 'top',
            //         textStyle: {
            //             color: '#6c50f3',
            //         }
            //     },
            //     itemStyle: {
            //         color: "#6c50f3",
            //         borderColor: "#fff",
            //         borderWidth: 3,
            //         shadowColor: 'rgba(0, 0, 0, .3)',
            //         shadowBlur: 0,
            //         shadowOffsetY: 2,
            //         shadowOffsetX: 2,
            //     },
            //     tooltip: {
            //         show: false
            //     },
            //     areaStyle: {
            //         normal: {
            //             color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
            //                 offset: 0,
            //                 color: 'rgba(0,202,149,0.3)'
            //             },
            //             {
            //                 offset: 1,
            //                 color: 'rgba(0,202,149,0)'
            //             }
            //             ], false),
            //             shadowColor: 'rgba(0,202,149, 0.9)',
            //             shadowBlur: 20
            //         }
            //     },
            //     data: supcount
            // },
        ]
    } as unknown as EChartOption;
}
